<template>
	<view class="content">
		<view class="list_title">{{testInfo.name}}</view>
		<view class="info_box">
			<view class="info_top">
				<view class="info_line"></view>简要信息
			</view>
			<view class="info_next_box">
				<view class="info_item">
					<view class="info_item_l">答题人次</view>
					<view class="info_item_r">{{testInfo.answer_num}}人</view>
				</view>
				<view class="info_item">
					<view class="info_item_l">答题时间</view>
					<view class="info_item_r">{{testInfo.answer_time}}分钟</view>
				</view>
				<view class="info_item">
					<view class="info_item_l">试题来源</view>
					<view class="info_item_r">{{testInfo.answer_source}}</view>
				</view>
				<view class="info_item">
					<view class="info_item_l">适用范围</view>
					<view class="info_item_r1">{{testInfo.scope}}</view>
				</view>
			</view>
		</view>
		<view class="explain_box">
			<view class="info_top">
				<view class="info_line"></view>试题说明
			</view>
			<view class="explain_con">
				{{testInfo.explain}}
			</view>
		</view>
		<view class="btm_box">
			<view class="coll_box">
				<image src="../../static/image/sjxq_ico_sc_nor@2x.png" mode="" @click="Collection()" v-show="testInfo.is_collect==0"></image>
				<image src="../../static/image/szrd_img_sc_sel@2x.png" mode="" @click="Collection()" v-show="testInfo.is_collect==1"></image>
				<view class="coll_tip">收藏</view>
			</view>
			<view class="input_box" @click="goDet">
				开始做题
			</view>
		</view>
	</view>
</template>

<script>
	import {question_bank,excreate,questiondetail} from '@/api/data.js'
	export default {
		data() {
			return {
				collStatus: 0,
				testInfo: [],
				qbid: '',
				end_second: '',
				eid: '',
				titlenum: ''
			}
		},
		onLoad(option) {
			this.qbid = option.id
			this.getTestInfo()
		},
		methods: {
			Collection(val) {
				this.collStatus = val
				var obj = {
					qb_id: this.qbid
				};
				question_bank(obj).then(res => {
					if (res.code == 1) {
						this.$msg(res.msg)
						this.getTestInfo()
					}
				});
			},
			goDet() {
				// 开始考试
				var obj = {
					qb_id: this.qbid
				};
				excreate(obj).then(res => {
					if (res.code == 1) {
						this.end_second = res.data.end_number
						this.eid = res.data.id
						this.titlenum = res.data.title_num
						uni.navigateTo({
							url: 'testDet?end_second=' + this.end_second + '&eid=' + this.eid + '&titlenum=' + this.titlenum
						})

					}
				});
			},
			getTestInfo() {
				var obj = {
					qb_id: this.qbid
				};
				questiondetail(obj).then(res => {
					if (res.code == 1) {
						this.testInfo = res.data
					}
				});
			}

		}
	}
</script>

<style>
	.content {
		width: 100%;
		height: 100%;
		overflow-y: auto;
	}

	.list_title {
		width: 100%;
		padding: 28rpx 30rpx;
		height: auto;
		background: #FBFBFB;
		margin-top: 20rpx;
		font-size: 34rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.info_box {
		width: 100%;
		height: 470rpx;
		background: #FFFFFF;
		margin-top: 20rpx;
		padding: 0 30rpx;
	}

	.info_top {
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		font-size: 34rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.info_line {
		width: 4rpx;
		height: 20rpx;
		background: #FFDD47;
		border-radius: 2rpx;
		margin-right: 8rpx;
	}

	.info_next_box {
		width: 95%;
		height: 332rpx;
		background: #FFFFFF;
		box-shadow: 0px 2rpx 10rpx 0px rgba(15, 11, 2, 0.13);
		border-radius: 10rpx;
		margin: auto;
		padding: 0 20rpx;
	}

	.info_item {
		width: 100%;
		height: 83rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.info_item_l {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #666666;
	}

	.info_item_r {
		width: 80%;
		height: 100%;
		display: flex;
		align-items: center;
		border-bottom: 1rpx solid #F5F5F5;
	}

	.info_item_r1 {
		width: 80%;
		height: 100%;
		display: flex;
		align-items: center;
	}

	.explain_box {
		width: 100%;
		height: auto;
		background: #FFFFFF;
		margin-top: 20rpx;
		padding: 0 30rpx;
	}

	.explain_con {
		padding-bottom: 30rpx;
		font-size: 28rpx;
		color: #333333;
		line-height: 42rpx;
	}

	.btm_box {
		width: 100%;
		height: 98rpx;
		background: #FFFFFF;
		position: fixed;
		bottom: 0rpx;
		padding: 0 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-top: 1rpx solid #E5E5E5;
	}

	.input_box {
		width: 574rpx;
		height: 70rpx;
		background: #FFDD47;
		border-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;

	}

	.coll_box {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-left: 30rpx;
	}

	.coll_box image {
		width: 46rpx;
		height: 44rpx;
	}

	.coll_tip {
		font-size: 22rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}
</style>
